/**
 * 使用plus.nativeObj绘制原生的弹窗界面
 * @version 2021-10-20 zzc
 */
class QiandaoDialog {

	constructor() {
		this.maskLayer = {}
		this.popupEle = {}
	}

	/**
	 * 显示
	 * @param { Object } params 对象
	 * @param { String } params.title 标题文字
	 * @param { String } params.content 内容
	 * @param { Boolean } params.showCancel 是否显示取消按钮
	 * @param { String } params.cancelText 取消按钮文字
	 * @param { String } params.confirmText 确定按钮文字
	 * @param { Function } params.confirm 确定回调
	 * @param { Function } params.cancel 取消回调
	 * @param { String } params.icon 顶部图标地址
	 * @param { String } params.titleAlign 标题对其方式， left | center
	 * @param { String } params.contentAlign 内容对其方式， left | center
	 * @version 2021-10-20 zzc
	 */
	show(params) {
		this.drawView(params)
		//this.maskLayer.show()
		this.popupEle.show()
	}

	/**
	 * 隐藏
	 * @version 2021-10-20 zzc
	 */
	hide() {
		//this.maskLayer.hide()
		this.popupEle.hide()
	}

	/**
	 * 绘制确认对话框ui
	 * @version 2021-10-19 zzc
	 */
	drawView(params) {
		const {
			confirmText = '确定',
				cancelText = '关闭',
				titleAlign = 'center',
				contentAlign = 'left',
				title = '提示',
				content,
				showCancel = true,
				confirm,
				cancel,
				icon,
		} = params

		const screenWidth = plus.screen.resolutionWidth
		const screenHeight = plus.screen.resolutionHeight

		const popWidth = screenWidth * 0.12
		let popHeight = 20
		const imageWidth = parseInt(popWidth);
		// 正文距离顶部
		let contentTop = 132

		// 弹窗容器的Padding
		const viewPadding = 0

		// 弹窗容器的宽度
		const viewWidth = parseInt(popWidth)

		// 更新描述文字
		const description = this.drawText(content, viewWidth)

		const textHeight = 18

		const popContent = []

		const confirmTextConfig = {
			tag: 'font',
			id: 'confirmText',
			text: cancelText,
			textStyles: {
				size: '13px',
				color: '#FFF',
				lineSpacing: '0%',
			},
		}

		// 如果没有图标
		if (icon) {
			popContent.unshift({
				src: icon,
				id: 'logo',
				tag: 'img',
				position: {
					top: '0px',
					left: '0px',
					right: '0px',
					width: `${imageWidth}px`,
					height: `${200 * imageWidth / 200}px`,
				}
			})
			popHeight += 200 * imageWidth / 200;
		} else {
			popHeight -= 30
			contentTop = 105
		}

		popContent.push({
			tag: 'font',
			id: 'title',
			text: '我要签到',
			textStyles: {
				size: '10px',
				color: '#fff',
				weight: 'bold',
				whiteSpace: 'normal'
			},
			position: {
				top: imageWidth + 'px',
				left: '0px',
				width: viewWidth + 'px',
				height: '16px',
			},
		})


		this.maskLayer = new plus.nativeObj.View('maskLayer', {
			top: '0px',
			left: '0px',
			height: '100%',
			width: '100%',
			backgroundColor: 'rgba(0,0,0,0.5)'
		})

		this.popupEle = new plus.nativeObj.View('popupEle', {
			tag: 'rect',
			top: '90px',
			left: '80%',
			height: popHeight + 'px',
			width: '15%'
		})

		// 绘制白色背景
		//this.popupEle.drawRect({
		//	color: '#FFFFFF',
		//	radius: '8px'
		//}, {
		//	top: '40px',
		//	height: popHeight - 40 + 'px',
		//})

		this.popupEle.draw(popContent);

		this.popupEle.addEventListener('click', (e) => {

			confirm && confirm()
			this.hide()
		})
	}

	/**
	 * 文本换行
	 * @param { String } text 文本内容
	 * @param { Number } maxWidth 宽度
	 */
	drawText(text, maxWidth) {
		let textArr = text.split('');
		let len = textArr.length;

		// 上个节点
		let previousNode = 0;

		// 记录节点宽度
		let nodeWidth = 0;

		// 文本换行数组
		let rowText = [];

		// 如果是字母，侧保存长度
		let letterWidth = 0;

		// 汉字宽度
		let chineseWidth = 14;

		// otherFont宽度
		let otherWidth = 7;

		for (let i = 0; i < len; i++) {
			if (/[\u4e00-\u9fa5]|[\uFE30-\uFFA0]/g.test(textArr[i])) {
				if (letterWidth > 0) {
					if (nodeWidth + chineseWidth + letterWidth * otherWidth > maxWidth) {
						rowText.push({
							type: 'text',
							content: text.substring(previousNode, i)
						});
						previousNode = i;
						nodeWidth = chineseWidth;
						letterWidth = 0;
					} else {
						nodeWidth += chineseWidth + letterWidth * otherWidth;
						letterWidth = 0;
					}
				} else {
					if (nodeWidth + chineseWidth > maxWidth) {
						rowText.push({
							type: 'text',
							content: text.substring(previousNode, i)
						});
						previousNode = i;
						nodeWidth = chineseWidth;
					} else {
						nodeWidth += chineseWidth;
					}
				}
			} else {
				if (/\n/g.test(textArr[i])) {
					rowText.push({
						type: 'break',
						content: text.substring(previousNode, i)
					});
					previousNode = i + 1;
					nodeWidth = 0;
					letterWidth = 0;
				} else if (textArr[i] == '\\' && textArr[i + 1] == 'n') {
					rowText.push({
						type: 'break',
						content: text.substring(previousNode, i)
					});
					previousNode = i + 2;
					nodeWidth = 0;
					letterWidth = 0;
				} else if (/[a-zA-Z0-9]/g.test(textArr[i])) {
					letterWidth += 1;
					if (nodeWidth + letterWidth * otherWidth > maxWidth) {
						rowText.push({
							type: 'text',
							content: text.substring(previousNode, i + 1 - letterWidth)
						});
						previousNode = i + 1 - letterWidth;
						nodeWidth = letterWidth * otherWidth;
						letterWidth = 0;
					}
				} else {
					if (nodeWidth + otherWidth > maxWidth) {
						rowText.push({
							type: 'text',
							content: text.substring(previousNode, i)
						});
						previousNode = i;
						nodeWidth = otherWidth;
					} else {
						nodeWidth += otherWidth;
					}
				}
			}
		}
		if (previousNode < len) {
			rowText.push({
				type: 'tex',
				content: text.substring(previousNode, len)
			});
		}
		return rowText;
	}

}

export default new QiandaoDialog()